<!doctype html>
<html lang="zh-cn">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->

    <title>Hello, world!</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <script src="js/jquery-3.4.1.slim.min.js"></script>
    <script src="js/bootstrap.bundle.js"></script>
    <script src="js/bootstrap.js"></script>

</head>
<body>
<h1>Hello, world!</h1>
<!--<div class="alert alert-primary" role="alert">-->
<!--    A simple primary alert—check it out!-->
<!--</div>-->
<!--<div class="alert alert-secondary" role="alert">-->
<!--    A simple secondary alert—check it out!-->
<!--</div>-->
<!--<div class="alert alert-success" role="alert">-->
<!--    A simple success alert—check it out!-->
<!--</div>-->
<!--<div class="alert alert-danger" role="alert">-->
<!--    A simple danger alert—check it out!-->
<!--</div>-->
<!--<div class="alert alert-warning" role="alert">-->
<!--    A simple warning alert—check it out!-->
<!--</div>-->
<!--<div class="alert alert-info" role="alert">-->
<!--    A simple info alert—check it out!-->
<!--</div>-->
<!--<div class="alert alert-light" role="alert">-->
<!--    A simple light alert—check it out!-->
<!--</div>-->
<!--<div class="alert alert-dark" role="alert">-->
<!--    A simple dark alert—check it out!-->
<!--</div>-->
<h1>Example heading <span class="badge badge-secondary">NewS</span></h1>
<button type="button" class="btn btn-primary">
    Notifications <span class="badge badge-light">4</span>
</button>
<div class="container">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
    <ol class="carousel-indicators">
        <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
        <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
        <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
    </ol>
    <div class="carousel-inner">
        <div class="carousel-item active">
            <img src="/img/sky-space-dark-galaxy.jpg" class="d-block w-100" alt="...">
        </div>
        <div class="carousel-item">
            <img src="/img/sleeping-cougar-3927606.jpg" class="d-block w-100" alt="...">
        </div>
        <div class="carousel-item">
            <img src="/img/taj-mahal-india-1603650.jpg" class="d-block w-100" alt="...">
        </div>
    </div>
    <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
    </a>
    <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>


</div>
</div>


<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModalCenter">
    Launch demo modal
  </button>
  
  <!-- Modal -->
  <div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalCenterTitle">Modal title</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body ">
            <p class="list-group-item-text text-break">
         淡lksfjlsdkfjlsdkflsdkfjsdlsdsfsdfsdfsdfsdfsdfdsdsfdssdfsdfdsdsfsdfsdfdsffsdfsdf第三方士大夫舒服舒服对方水电费水电费伞的fkjsdlfsldkfdlsfkdfkdslfkdskflksdjflkkk楼
        </p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary">Save changes</button>
        </div>
      </div>
    </div>
  </div>
<span class="badge badge-primary">Primary</span>
<span class="badge badge-secondary">Secondary</span>
<span class="badge badge-success">Success</span>
<span class="badge badge-danger">Danger</span>
<span class="badge badge-warning">Warning</span>
<span class="badge badge-info">Info</span>
<span class="badge badge-light">Light</span>
<span class="badge badge-dark">Dark</span>




<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->


</body>